<template>
  <div class="flowpath-container">
    <div>
      <div class="mb20">
        <span class="color_494949 ft12 pr5">{{ translate('物资名称') }}：</span>
        <el-input
          v-model="searchInfo"
          class="w164 mr10"
          :placeholder="translate('请输入关键字')"
        />
        <span class="color_494949 ft12 pr5">{{ translate('物资编码') }}：</span>
        <el-input
          v-model="searchInfo1"
          class="w164 mr10"
          :placeholder="translate('请输入关键字')"
        />
        <span class="color_494949 ft12 pr5">{{ translate('单位') }}：</span>
        <el-input
          v-model="searchInfo2"
          class="w164 mr10"
          :placeholder="translate('请输入关键字')"
        />
        <span class="color_494949 ft12 pr5 w70">{{ translate('预警值') }}：</span>
        <el-select
          v-model="IvtQty"
          class="w164 mr10"
          :placeholder="translate('请选择')"
         >
          <el-option
            v-for="item in RemarkArry"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
          </el-select>
        <el-button class="settingBtn mr10" type="primary" @click="getList">
          {{ translate('查询') }}
        </el-button>
      </div>
      <div class="add">
        <el-button
          v-if="MenuAuths('add')"
          class="settingBtn"
          type="primary"
          @click="addFn"
          plain
        >
          {{ translate('新增') }}
        </el-button>
        <el-button
          v-if="MenuAuths('add')"
          class="settingBtn"
          type="primary"
          @click="download"
          plain
        >
          {{ translate('导出') }}
        </el-button>
      </div>
      <el-table :data="tableData" :loading="loading">
        <!-- <el-table-column label="序号" type="index" width="80" /> -->
        <el-table-column :label="translate('预警单位')" prop="WHUnit" />
        <el-table-column :label="translate('库位')" prop="Remark" />
        <el-table-column :label="translate('类别')" prop="ItemCate" />
        <el-table-column :label="translate('物资名称')" prop="ItemName" />
        <el-table-column label="物资编码" prop="ItemCode" />
        <el-table-column
          :label="translate('物资类型')"
          prop="Owner"
          width="auto"
        />
        <el-table-column :label="translate('规格')" prop="ItemSpec" />
        <el-table-column :label="translate('单位')" prop="ItemUnit" />
        <el-table-column :label="translate('库存')" prop="StockQty" />
        <el-table-column :label="translate('阈值')" prop="FZQty" />
        <el-table-column :label="translate('提示')">
          <template #default="{ row }">
            <el-tooltip
              v-if="row.FZQty - row.StockQty > 0"
              class="item"
              content="物资库存偏低！"
              effect="dark"
              placement="top-start"
            >
              <vab-icon class="alarm-warning-fill" icon="alarm-warning-fill" />
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column :label="translate('保养时间')" prop="ServiceTime" />
        <el-table-column :label="translate('保养间隔(天)')" prop="ServiceDay" />
        <el-table-column :label="translate('创建人')" prop="CreateUserName" />
        <el-table-column :label="translate('操作')" width="300">
          <template #default="{ row }">
            <el-button
              v-if="MenuAuths('edit')"
              plain
              size="small"
              type="primary"
              @click="detailFn(row)"
            >
              {{ translate('编辑') }}
            </el-button>
            <el-button
              v-if="MenuAuths('edit')"
              plain
              size="small"
              type="primary"
              @click="updateFn(row)"
            >
              {{ translate('更新保养时间') }}
            </el-button>
            <el-button
              v-if="MenuAuths('delete')"
              plain
              size="small"
              type="danger"
              @click="deletedFn(row)"
            >
              {{ translate('删除') }}
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <el-pagination
          background
          :current-page="pageNo"
          :layout="layout"
          :page-size="pageSize"
          :total="total"
          @current-change="handleCurrentChange"
          @size-change="handleSizeChange"
        />
      </div>
    </div>
    <el-dialog
      v-model="dialogVisible"
      :title="translate('物资库存阈值')"
      width="1220px"
      @close="closeFn"
    >
      <i v-if="status === 1" class="iconfont icon-shenhezhong iconcommon"></i>
      <i v-if="status === 2" class="iconfont icon-yishenhe iconcommon2"></i>
      <detail
        :chileddetail="chileddetail"
        :form="form"
        fromtype="goodslist"
        :purchaselist="PurchaseList"
        @deletedchild="deletedchild"
      />
      <template #footer>
        <el-button @click="dialogVisible = false">
          {{ translate('取消') }}
        </el-button>
        <el-button type="primary" @click="submit">
          {{ translate('确定') }}
        </el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script>
  import {
    GetPageDataST,
    delst,
    Wms_planUpdateData,
    Wms_planAddData,
    Wms_PurchaseList,
    startflow,
    Wms_ItemPlanDown,
    getst,
    savest,
    updateTime,
    ExportST,
  } from '@/api/form'
  import detail from './components/detail'
  import { MenuAuth } from '~/src/utils/permission'
  import { translate } from '@/i18n'
  import { parseTime } from '@/utils'
  const  route  = useRoute()
  export default defineComponent({
    name: 'Flowpath',
    components: { detail },
    data() {
      return {
        tableData: [],
        searchInfo: '',
        searchInfo1: '',
        searchInfo2: '',
        total: 0,
        pageNo: 1,
        pageSize: 20,
        dialogVisible: false,
        enabled: 0,
        DetailPageData: {},
        chileddetail: [],
        submitType: 'add',
        layout: 'total, sizes, prev, pager, next, jumper',
        deleList: [],
        MenuAuths: '',
        tableRef: null,
        isPrint: false,
        loading: false,
        PurchaseList: [],
        formId: '',
        sid: '',
        IvtQty: '0',
        RemarkArry: [
          {
            label: '全部',
            value: '0'
          },
          {
            label: '大于库存',
            value: '1'
          },
          {
            label: '小于库存',
            value: '2'
          },
        ],
        form: {
          IBType: '',
          InComeNo: '',
          AcceptanceNo: '',
          SourceBillNo: '',
          Supplier: '',
          CCode: '',
          EntrustNo: '',
          CustomizeNo: '',
          ProjectName: '',
          WorkBillNo: '',
          AcceptanceConclusion: '',
          CategoryNumber: '',
          InComeDate: '',
          PurchaseNo: '',
          Description: '',
          Documenter: '',
          MaterialReceiver: '',
          FinancialReviewer: '',
        },
      }
    },
    created() {
      this.MenuAuths = MenuAuth
      this.getList()
    },
    methods: {
      translate(row) {
        return translate(row)
      },
      async updateFn(row) {
        row.Owner = this.$route.path === '/StockThreshold/itemstockSt1' ? '技术中心': (this.$route.path === '/StockThreshold/itemstockSt2' ? '基建项目' : this.$route.path === '/StockThreshold/itemstockSt3'? '应急物资' : '')
        const params = [row]
        const data = await updateTime(params)
        if (data.Code == '200' || data.Code == '200') {
          this.getList()
          this.$message({
            message: translate('更新成功'),
            type: 'success',
          })
        }
      },
      async Wms_PurchaseList() {
        const params = {
          sid: this.sid,
        }
        const data = await getst(params)
        if (data.code === '200' || data.Code === '200') {
          console.log(data.data)
          this.chileddetail = [data.Data.data]
        }
      },
         // 下载物资表
         async download() {
          const params = {
          pageNo: this.pageNo,
          pageSize: this.pageSize,
          tableName: '',
          sort: '',
          order: '',
          wheres: JSON.stringify([
            { name: 'ItemName', value: this.searchInfo, displayType: 'like' },
            { name: 'ItemCode', value: this.searchInfo1, displayType: 'like' },
            { name: 'WHUnit', value: this.searchInfo2, displayType: 'like' },
          ]),
          export: false,
          value: this.IvtQty,
        }
        params.openid = this.$route.path === '/StockThreshold/itemstockSt1' ? '技术中心': (this.$route.path === '/StockThreshold/itemstockSt2' ? '基建项目' : this.$route.path === '/StockThreshold/itemstockSt3'? '应急物资' : '')
        const data = await ExportST(params)
        const time = parseTime(new Date().getTime(), '{y}{m}{d}{h}{i}{s}')
        const blob = new Blob([data])
        const url = URL.createObjectURL(blob)
        const link = document.createElement('a')
        link.download = `物资库存阈值${time}.xlsx`
        link.href = url
        link.click()
      },
      async getList() {
        const params = {
          pageNo: this.pageNo,
          pageSize: this.pageSize,
          tableName: '',
          sort: '',
          order: '',
          wheres: JSON.stringify([
            { name: 'ItemName', value: this.searchInfo, displayType: 'like' },
            { name: 'ItemCode', value: this.searchInfo1, displayType: 'like' },
            { name: 'WHUnit', value: this.searchInfo2, displayType: 'like' },
          ]),
          export: false,
          value: this.IvtQty,
        }
        console.log(this.$route.path)
        params.openid = this.$route.path === '/StockThreshold/itemstockSt1' ? '技术中心': (this.$route.path === '/StockThreshold/itemstockSt2' ? '基建项目' : this.$route.path === '/StockThreshold/itemstockSt3'? '应急物资' : '')
        const data = await GetPageDataST(params)
        this.tableData = data.data.rows
        this.total = data.data.total
        console.log(this.tableData)
      },
      deletedchild(e) {
        this.deleList = e
        console.log(e)
      },
      async deletedFn(row) {
        this.$confirm(translate('确认删除吗?'), translate('提示'), {
          confirmButtonText: translate('确定'),
          cancelButtonText: translate('取消'),
          type: 'warning',
        })
          .then(() => {
            this.deleted(row)
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: translate('已取消删除'),
            })
          })
      },
      async deleted(row) {
        const params = {
          sid: row.ID,
        }
        const data = await delst(params)
        if (data.code == '200' || data.Code == '200') {
          this.$message({
            message: translate('删除成功'),
            type: 'success',
          })
          await this.getList()
        }
      },
      //分页条数切换
      handleSizeChange(val) {
        this.pageSize = val
        this.getList()
      },
      //分页切换
      handleCurrentChange(val) {
        this.pageNo = val
        this.getList()
      },
      async addFn() {
        this.submitType = 'add'
        this.status = -1
        this.form = {
          IBType: '',
          InComeNo: '',
          AcceptanceNo: '',
          SourceBillNo: '',
          Supplier: '',
          CCode: '',
          EntrustNo: '',
          CustomizeNo: '',
          ProjectName: '',
          WorkBillNo: '',
          AcceptanceConclusion: '',
          CategoryNumber: '',
          InComeDate: '',
          PurchaseNo: '',
          Description: '',
          Documenter: '',
          MaterialReceiver: '',
          FinancialReviewer: '',
        }
        // await this.Wms_PurchaseList()
        this.chileddetail = []
        this.dialogVisible = true
        this.deleList = []
      },
      submit() {
        this.updataSaveList()
      },
      closeFn() {
        this.enabled = 0
        this.form.WorkFlowID = ''
      },
      async detailFn(row) {
        this.deleList = []
        this.form = row
        this.sid = row.ID
        this.submitType = 'edit'
        await this.Wms_PurchaseList()
        this.dialogVisible = true
      },
      async AddData() {
        const params = {
          mainData: this.form,
          detailData: this.chileddetail,
          delKeys: [],
        }
        const data = await Wms_planAddData(params)
        if (data.code == '200' || data.Code == '200') {
          this.getList()
          this.$message({
            message: translate('保存成功'),
            type: 'success',
          })
          this.dialogVisible = false
        }
      },
      async updataSaveList() {
        this.chileddetail[0].Owner = this.$route.path === '/StockThreshold/itemstockSt3' ? '应急物资': ''
        const params = this.chileddetail
        console.log(this.$route.path)
        const data = await savest(params)
        if (data.Code == '200' || data.Code == '200') {
          this.getList()
          this.$message({
            message: translate('保存成功'),
            type: 'success',
          })
          this.dialogVisible = false
        }
      },
    },
  })
</script>
<style lang="scss" scoped>
  .flowpath-container {
    .color_494949 {
      color: #494949;
    }
    .w164 {
      width: 164px;
    }
    .mb20 {
      margin-bottom: 20px;
    }
    .mr10 {
      margin-right: 10px;
    }

    .iconcommon {
      position: absolute;
      top: 80px;
      right: 70px;
      font-size: 60px;
      color: blue;
    }
    .iconcommon2 {
      position: absolute;
      top: 80px;
      right: 70px;
      font-size: 60px;
      color: red;
    }
    .alarm-warning-fill {
      color: red;
    }
    .add {
      margin-bottom: 10px;
      text-align: left;
    }
  }
</style>
